<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>报表管理</title>
    <link rel="stylesheet" type="text/css" href="../../css/common/base.css">
    <link rel="stylesheet" type="text/css" href="../../css/report/report.css">
    <link rel="stylesheet" type="text/css" href="../../plugin/switchTab/css/responsive.tabs.css">
    <link rel="stylesheet" type="text/css" href="../../plugin/datepockerRange/css/datepicker.css">
</head>

<body>
    <div id="report-tabs" class="lz-main">
        <ul class="tabs-list ts-list">
            <li class="active"><a>诊所运营</a></li>
            <li><a>患者统计</a></li>
            <li><a>收费统计</a></li>
            <li><a>药物统计</a></li>
        </ul>
        <div class="ts-container">
            <div class="ts-content arrange-content">
                <div class="lz-lr-layout operate-box">
                    <ul class="tabs-list-portrait ts-list op-left">
                        <li class="active"><a>经营状况</a></li>
                        <li><a>诊所收入分布</a></li>
                        <li><a>科室收入分布</a></li>
                        <li><a>医生收入分布</a></li>
                    </ul>
                    <div class="ts-container op-right">
                        <div class="ts-content ob-condition">
                            <div class="obc-head">
                                <button type="button" class="lz-btn lz-btn-primary">今天</button>
                                <button type="button" class="lz-btn lz-btn-primary">昨天</button>
                                <button type="button" class="lz-btn lz-btn-primary">近7天</button>
                                <button type="button" class="lz-btn lz-btn-primary">近30天</button>
                            </div>
                            <div class="obc-cord-box">
                                <div class="obcc-left">
                                    <div class="obccl-img"></div>
                                    <div class="obccl-content">
                                        <div class="obccl-money">
                                            <span>就诊金额</span>
                                            <span class="money">3123元</span>
                                        </div>
                                        <div class="obccl-money">
                                            <span>零售金额</span>
                                            <span class="money">23123元</span>
                                        </div>
                                        <div class="obccl-money">
                                            <span>总金额</span>
                                            <span class="money">12324元</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="obcc-right">
                                    <div class="obccr-img"></div>
                                    <div class="obccr-content">
                                        <div class="obccr-per">
                                            <span>就诊人数</span>
                                            <div class="obccrp-num">
                                                <span>0</span>
                                                <span>比昨天10人</span>
                                            </div>
                                        </div>
                                        <div class="obccr-per">
                                            <span>零售人数</span>
                                            <div class="obccrp-num">
                                                <span>0</span>
                                                <span>比昨天10人</span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="obc-report report-one"></div>
                            <div class="obc-report report-two"></div>
                        </div>
                        <div class="ts-content ob-clinic">
                            <div class="obc-head obch-date">
                                <form class="lz-form">
                                    <div class="lz-form-row reg-search-form">
                                        <div class="lz-col-2 lz-form-item">
                                            <label class="lz-form-item-label">日期:</label>
                                            <div class="c-datepicker-date-editor  J-datepicker-range-day mt10">
                                                <i class="c-datepicker-range__icon kxiconfont icon-clock"></i>
                                                <input placeholder="开始日期" name="" class="c-datepicker-data-input two-date" value="">
                                                <span class="c-datepicker-range-separator">-</span>
                                                <input placeholder="结束日期" name="" class="c-datepicker-data-input two-date" value="">
                                            </div>
                                        </div>
                                        <div class="lz-col-1 lz-form-item search-btn">
                                            <button type="button" class="lz-btn lz-btn-primary">搜索</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div class="obc-cord-box">
                                <div class="obcc-left">

                                </div>
                                <div class="obcc-right">

                                </div>
                            </div>
                            <div class="obc-table">

                            </div>
                        </div>
                        <div class="ts-content ob-clinic">
                            <div class="obc-head obch-date">
                                <form class="lz-form">
                                    <div class="lz-form-row reg-search-form">
                                        <div class="lz-col-2 lz-form-item">
                                            <label class="lz-form-item-label">日期:</label>
                                            <div class="c-datepicker-date-editor  J-datepicker-range-day mt10">
                                                <i class="c-datepicker-range__icon kxiconfont icon-clock"></i>
                                                <input placeholder="开始日期" name="" class="c-datepicker-data-input two-date" value="">
                                                <span class="c-datepicker-range-separator">-</span>
                                                <input placeholder="结束日期" name="" class="c-datepicker-data-input two-date" value="">
                                            </div>
                                        </div>
                                        <div class="lz-col-1 lz-form-item search-btn">
                                            <button type="button" class="lz-btn lz-btn-primary">搜索</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div class="obc-cord-box">
                                <div class="obcc-left">

                                </div>
                                <div class="obcc-right">

                                </div>
                            </div>
                            <div class="obc-table">

                            </div>
                        </div>
                        <div class="ts-content ob-clinic">
                            <div class="obc-head obch-date">
                                <form class="lz-form">
                                    <div class="lz-form-row reg-search-form">
                                        <div class="lz-col-2 lz-form-item">
                                            <label class="lz-form-item-label">日期:</label>
                                            <div class="c-datepicker-date-editor  J-datepicker-range-day mt10">
                                                <i class="c-datepicker-range__icon kxiconfont icon-clock"></i>
                                                <input placeholder="开始日期" name="" class="c-datepicker-data-input two-date" value="">
                                                <span class="c-datepicker-range-separator">-</span>
                                                <input placeholder="结束日期" name="" class="c-datepicker-data-input two-date" value="">
                                            </div>
                                        </div>
                                        <div class="lz-col-1 lz-form-item search-btn">
                                            <button type="button" class="lz-btn lz-btn-primary">搜索</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div class="obc-cord-box">
                                <div class="obcc-left">

                                </div>
                                <div class="obcc-right">

                                </div>
                            </div>
                            <div class="obc-table">

                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="ts-content arrange-content">
                <div class="lz-lr-layout patient-box">
                    <ul class="tabs-list-portrait ts-list op-left">
                        <li class="active"><a>就诊日志</a></li>
                        <li><a>医生分布</a></li>
                        <li><a>年龄段</a></li>
                        <li><a>性别</a></li>
                        <li><a>初复诊</a></li>
                        <li><a>复诊率</a></li>
                    </ul>
                    <div class="ts-container op-right">
                        <div class="ts-content ob-condition">
                            <h1>表格1</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格2</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格3</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格4</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格5</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格6</h1>
                        </div>
                    </div>
                </div>
            </div>
            <div class="ts-content arrange-content">
                <div class="lz-lr-layout charge-box">
                    <ul class="tabs-list-portrait ts-list op-left">
                        <li class="active"><a>收费员</a></li>
                        <li><a>科室</a></li>
                        <li><a>开单业绩</a></li>
                        <li><a>处方项目</a></li>
                        <li><a>收费流水</a></li>
                    </ul>
                    <div class="ts-container op-right">
                        <div class="ts-content ob-condition">
                            <h1>表格1</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格2</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格3</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格4</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格5</h1>
                        </div>
                    </div>
                </div>
            </div>
            <div class="ts-content arrange-content">
                <div class="lz-lr-layout medicine-box">
                    <ul class="tabs-list-portrait ts-list op-left">
                        <li class="active"><a>进销存</a></li>
                        <li><a>药品收益</a></li>
                        <li><a>调价</a></li>
                        <li><a>每日销售清单</a></li>
                        <li><a>出入库</a></li>
                        <li><a>药品流水</a></li>
                    </ul>
                    <div class="ts-container op-right">
                        <div class="ts-content ob-condition">
                            <h1>表格1</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格2</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格3</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格4</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格5</h1>
                        </div>
                        <div class="ts-content ob-condition">
                            <h1>表格6</h1>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="../../js/common/jquery/jquery-2.2.4.js"></script>
    <script src="../../js/common/highcharts/highcharts.js"></script>
    <script src="report.js"></script>
    <script src="../../plugin/switchTab/js/responsive.tabs.js"></script>
    <script src="../../plugin/switchTab/js/re-tabs-simplify.js"></script>
    <script src="../../plugin/datepockerRange/js/moment.min.js"></script>
    <script src="../../plugin/datepockerRange/js/datepicker.all.js"></script>
    <script>
        $(function() {
            $('#report-tabs').resTabsSimp();
            $('.operate-box').resTabsSimp();
            $('.patient-box').resTabsSimp();
            $('.charge-box').resTabsSimp();
            $('.medicine-box').resTabsSimp();
            $('.J-datepicker-range-day').datePicker({
                hasShortcut: true,
                format: 'YYYY-MM-DD',
                isRange: true,
                shortcutOptions: [{
                    name: '最近一周',
                    day: '-7,0'
                }, {
                    name: '最近一个月',
                    day: '-30,0'
                }, {
                    name: '最近三个月',
                    day: '-90, 0'
                }]
            });
            showOne();
            showTwo()
        })

        function showOne() {
            let json = getJsonOne();
            $('.report-one').highcharts(json);
        }

        function showTwo() {
            let json = getJsonTwo();
            $('.report-two').highcharts(json);
        }
    </script>
</body>

</html>